<template>
	<view class="containerbox">
		<uv-navbar title="试课登记表" auto-back placeholder />
			
		<scroll-view scroll-y class="containerbox">
			<view class="w-full title text-26 px-30 pb-10 pt-20 font-weight-600">基本资料</view>
			<fui-list color="#3A3F5E" size="30">
				<form_cell lable="学生姓名">
					<view class="flex items-center -mr-10 flex-1">
						<fui-input 
							placeholder="请输入" 
							:padding="['0','0']" 
							:placeholder-style="placeholderStyle" 
							text-right
							:border-bottom="false"
							v-model="studentInfo.name"
						/>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				<form_cell lable="性别" @click="upGender = true" :is-highlight="true">
					<view class="flex items-center -mr-10">
						<view class="mb-7 color6">{{ userInfo.gender?.name }}</view>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
					
				<form_cell lable="试课时间" :is-highlight="true" @click="trialDatetimePicker?.open">
					<view class="flex items-center -mr-10">
						<view class="mb-7 color6" v-if="userInfo.trialDate">{{ userInfo.trialDate }}</view>
						<view class="mb-7 color9" v-else>暂无</view>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				
				<form_cell lable="就读学校">
					<view class="flex items-center -mr-10 flex-1">
						<fui-input 
							placeholder="请输入" 
							:padding="['0','0']" 
							:placeholder-style="placeholderStyle" 
							text-right
							:border-bottom="false"
							v-model="studentInfo.school"
						/>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				<form_cell lable="年级" @click="upGrade = true">
					<view class="flex items-center -mr-10 flex-1">
						<view class="mb-7 color6 ml-auto" v-if="userInfo.grade?.name">{{ userInfo.grade.name }}</view>
						<view class="mb-7 color9 ml-auto" v-else>请选择</view>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				<form_cell lable="父亲职业">
					<view class="flex items-center -mr-10 flex-1">
						<fui-input 
							placeholder="请输入" 
							:padding="['0','0']" 
							:placeholder-style="placeholderStyle" 
							text-right
							:border-bottom="false"
							v-model="studentInfo.fatherWork"
						/>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				<form_cell lable="母亲职业">
					<view class="flex items-center -mr-10 flex-1">
						<fui-input 
							placeholder="请输入" 
							:padding="['0','0']" 
							:placeholder-style="placeholderStyle" 
							text-right
							:border-bottom="false"
							v-model="studentInfo.motherWork"
						/>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				<form_cell lable="家庭住址">
					<view class="flex items-center -mr-10 flex-1">
						<fui-input 
							placeholder="请输入" 
							:padding="['0','0']" 
							:placeholder-style="placeholderStyle" 
							text-right
							:border-bottom="false"
							v-model="studentInfo.address"
						/>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
			</fui-list>
			
			<view class="w-full title text-26 font-weight-600 px-30 pb-10 pt-20">学习情况</view>
			<fui-list color="#3A3F5E" size="30">
				<form_cell lable="语文成绩" :right-text="userInfo.chineseScore" />
				<form_cell lable="数学成绩" :right-text="userInfo.mathScore" />
				<form_cell lable="英语成绩" :right-text="userInfo.englishScore" />
				<form_cell lable="班级排名" :right-text="userInfo.classRank" />
				<form_cell lable="年级排名" :right-text="userInfo.gradeRank" />
				
				<form_cell lable="是否在上或者上过补习班" :is-highlight="true" @click="openupType(0)">
					<view class="flex items-center -mr-10">
						<view class="mb-7 color6" v-if="userInfo.extraStudy?.value">{{ userInfo.extraStudy?.name }}</view>
						<view class="mb-7 color9" v-else>请选择</view>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				
				<form_cell lable="对学习英语有无兴趣" :is-highlight="true" @click="openupType(1)">
					<view class="flex items-center -mr-10">
						<view class="mb-7 color6" v-if="userInfo.learningInterest?.value">{{ userInfo.learningInterest?.name }}</view>
						<view class="mb-7 color9" v-else>请选择</view>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
			</fui-list>
			
			<view class="w-full title text-26 font-weight-600 px-30 pb-10 pt-20">学习情况</view>
			<fui-list color="#3A3F5E" size="30">
				<form_cell lable="试课渠道" :is-highlight="true" @click="openupType(2)">
					<view class="flex items-center -mr-10">
						<view class="mb-7 color6" v-if="userInfo.source?.value">{{ userInfo.source?.name }}</view>
						<view class="mb-7 color9" v-else>请选择</view>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell>
				
				<form_cell lable="推荐人" :right-text="userInfo.recommender?userInfo.recommender:'暂无'" />
				<!-- <form_cell lable="推荐人">
					<view class="flex items-center -mr-10 flex-1">
						<fui-input 
							placeholder="请输入" 
							:padding="['0','0']" 
							:placeholder-style="placeholderStyle" 
							text-right
							:border-bottom="false"
							v-model="studentInfo.referrerCode"
						/>
						<fui-icon name="arrowright" size="35" color="#c2c5cc" />
					</view>
				</form_cell> -->
			</fui-list>
			
			<view class="w-full title text-26 font-weight-600 px-30 pb-10 pt-20">测试情况</view>
			<fui-list color="#3A3F5E" size="30">
				<form_cell lable="账号" :right-text="userInfo.authAccount?.account" />
				<form_cell lable="首测词汇量" :right-text="userInfo.vocabulary" />
				<form_cell lable="英语水平" :right-text="userInfo.englishLevel" />
				<form_cell lable="体验词库" :right-text="userInfo.trialDuration" />
				
				<form_cell 
					lable="试课效果" 
					:right-text="`${ userInfo.trialDuration }分钟记住${ userInfo.rememberWords }单词，争取了${ userInfo.accuracyRate }`"
				/>
			</fui-list>
			
			<view class="w-1 h-20" />
		</scroll-view>
		
		<view class="flex-between px-30 py-30 bgc-white border-top">
			<!-- <view class="flex-1 flex-center">
				<fui-button background="#e6f4ff" color="#0B9AFF" text="打印" width="310rpx" />
			</view> -->
			
			<fui-button text="提交" class="flex-1" @click="confirm" />
		</view>
		
		<up_gender v-model="upGender" />
		<uv-datetime-picker ref="trialDatetimePicker" v-model="trialDatetime" mode="date" @confirm="trialDateConfirm" round="32rpx" />
		<up_type v-model:show="typeShow" :type="uptype" />
		<up_geade v-model="upGrade" />
	</view>
</template>

<script setup>
	
	import { ref, computed ,reactive } from 'vue'
	import { putAuth } from '@/common/apis/other'
	import { getuserInfo } from '@/common/apis/account'
	
	import form_cell from './components/cell.vue'
	import up_gender from './components/upGender.vue'
	import up_type from './components/upType.vue'
	import up_geade from './components/upGrade.vue'
	import { onLoad } from "@dcloudio/uni-app"
	
	let placeholderStyle = 'color:#999999;font-size:28rpx'
	
	let { user } = uni.$store()
	let userInfo = computed(() => user.userInfo)
	let full = (num = 0) => num < 10 ? `0${num}` : num
	
	const studentInfo=reactive({
		name:'',//姓名
		// gender:{},//性别
		trialDate:'',//试课时间
		school:'',//就读学校
		grade:'',//年级
		fatherWork:'',//父亲职业
		motherWork:'',//母亲职业
		address:'',//家庭住址
		referrerCode:'',//推荐码
	})
	
	let upGender = ref()
	let trialDatetime = ref()
	let trialDatetimePicker = ref(null)
	
	let upGrade = ref()
	
	// let referrerCode = ref()
	
	onLoad(async () => {
		let { name, school, grade , gender, trialDate ,fatherWork , motherWork , address , referrerCode} = userInfo.value
		studentInfo.name = name
		studentInfo.school = school
		studentInfo.trialDate = trialDate
		studentInfo.fatherWork = fatherWork
		studentInfo.motherWork = motherWork
		studentInfo.address = address
		studentInfo.referrerCode = referrerCode
	})
	
	function initTrialDate(time) {
		let tempTime = time ? new Date(time) : new Date()
		let year = tempTime.getFullYear()
		let moth = tempTime.getMonth() + 1
		let day = tempTime.getDate()
		trialDatetime.value = `${year}-${full(moth)}-${full(day)}`
		user.userInfo.trialDate = trialDatetime.value
	}
	let trialDateConfirm = event => initTrialDate(event.value)
	initTrialDate(user.userInfo?.trialDate?.replace(/-/g, '/'))
	
	let uptype = ref(0)
	let typeShow = ref()
	function openupType(type) {
		uptype.value = type
		typeShow.value = true
	}
	
	async function confirm() {
		uni.showLoading({ title: '提交中' })
		try {
			let { extraStudy, learningInterest, source, gender, trialDate, grade } = userInfo.value
			let params = {
				referrerCode: studentInfo.referrerCode,
				extraStudy: extraStudy?.value,
				learningInterest: learningInterest?.value,
				source: source?.value,
				gender: gender?.value,
				gradeId: grade.id,
				trialDate
			}

			let data = { ...studentInfo, ...params }
			await putAuth(data)
			const userinfo = await getuserInfo()
			user.setuserInfo(userinfo)
			uni.$fui.toast('提交成功')
			uni.hideLoading()
			uni.navigateBack()
		} catch(e) {
			console.log(e)
			uni.navigateBack()
		}
	}
	
</script>

<style scoped lang="scss">
	::v-deep .fui-input__self{padding-right: 0 !important}
	::v-deep .uv-popup__content{border-radius: 20rpx 20rpx 0 0}
	::v-deep .data-v-01a3ad6e > view:nth-child(2){background-color: transparent !important}
	.color-3a{color: #3A3F5E}
	.color6{color: #626780}
	.color9{color: #999999}
	.color-1a{color: #1A1A1A}
	.title{background: #EEEEEE}
	.mb-7{margin-bottom: 7rpx}
	.ml-auto{margin-left: auto}
</style>